<!--订单首页-->
<style scoped lang="less">
.gridbg {
  background-color: #fefefe;
}
.order-list {
  .todo {
    height:0.86rem; 
    line-height:0.86rem; 
    padding:0 0.2rem;
    .tag {
      height:0.56rem;
      line-height: 0.56rem;
      padding:0 0.2rem;
      margin-left: 0.1rem;
      background:#ff7202;
      color:#fff;
      border-radius: 0.28rem;
    }
  }
  .list-order-warp{
    background: #fff;
    .title {
      padding:10px;
      color:#888;
      font-size:14px; 
      border-bottom:1px solid #ebebeb;
    }
    .con {
      padding: 0.1rem 0.2rem;
      border-bottom: 1px solid #ebebeb;
      .cargo {
        margin: 0.1rem;
        height: 1.3rem;
        width:1.3rem;
        text-align: center;
        border-radius: .08rem;
        background: #edf8f8;
        overflow: hidden;
        i {
          display: block;
          height: 1rem;
          line-height: 1rem;
          font-size: .6rem;
          color: #77babd;
        }
        p {
          height: .3rem;
          line-height: .3rem;
          font-size: .2rem;
          color: #fff;
          background: #77babd;
        }
      }
      .msg {
        margin-left:0.2rem;
        font-size:13px;
        line-height: 0.5rem;
      }
    }
    .btn-grp {
      padding:0.1rem 0.2rem 0.1rem 0;
      text-align: right;
      .btn{
        margin-left: 0.1rem;
      }
    }
  }
}
</style>

<template>
  <div class="order-list">
    <manage-header></manage-header>
      <div class="todo">
        待签收订单<span class="tag">{{totalRecords}}</span>
      </div>

      <scroller lock-x scrollbar-y use-pullup height="-228" ref="Scroller" :pullup-config="ScrollerConfig">
        <div>
          <div class="list-order-warp mb30" v-for="item in todolist">
            <div class="title">
              入库单号：{{item.billno}}
            </div>
            <div class="displayflex con">
              <span class="cargo">
                <i class="iconfont icon-cargo"></i>
                <p>{{item.detailsum}}个</p>
              </span>
              <div class="msg">
                <p>制单时间：{{item.billdate}}</p>
                <p>供应单位：{{item.suppliername}}</p>
                <p>业务员：{{item.mkstaffname}}</p>
              </div>
            </div>
            <div class="btn-grp">
              <div class="btn" v-on:click="goToSign(item.billno)">签收</div>
            </div>
          </div>
        </div>
      </scroller>

    <manage-footer :status="1"></manage-footer>
  </div>
</template>

<script>
import manageFooter from "@/components/core/footer/manage.footer.vue";
import manageHeader from "@/components/core/header/manage.header.vue";
export default {
  name: "orderIndex",
  components: {
    manageFooter,
    manageHeader
  },
  data() {
    return {
      ScrollerConfig:{
        content: '',
        downContent: '',
        height: 0,
        loadingContent: '',
        upContent: '',
      },
      todolist: [],
      totalRecords:0,
    };
  },
  created() {
    this.getdata();
  },
  mounted() {
    this.$nextTick(function() {
      
    });
  },
  methods: {
    goToSign(args){
      this.$router.push({ 
        path: 'CheckGoods', 
        query: { 
          BillNo: args
        } 
      })
    },
    getdata() {
      var self = this;
      this.Ajax.post('wxh/order/getUnAccOrders').then((resp) => {
        if (resp.errorCode==0) {
          this.totalRecords = resp.data.length;
          this.todolist=resp.data;
        } else {
          this.Toast({
            message: resp.message || '操作异常，请稍后重试',
          });
        };
      });
    }
  }
};
</script>
